import {ModalForm, ProFormDigit, ProFormSelect, ProFormText} from '@ant-design/pro-components';


export interface FormValueType extends Partial<API.DbBackupEdit> {
    target?: string;
    template?: string;
    time?: string;
    frequency?: string;
}


export interface EditFormProps {
    onOpenChange: (flag?: boolean, formVals?: FormValueType) => void;
    onSubmit: (values: FormValueType) => Promise<void>;
    editModalVisible: boolean;
    values: Partial<API.DbBackupEdit>;
    dbTypeEnum: Partial<Record<string, { text: string; status: string }>>;
    sshData: Partial<Record<string, { text: string; status: string }>>;
}


export default (props: EditFormProps) => {
    return (
        <ModalForm
            title="修改数据库信息"
            open={props.editModalVisible}
            onOpenChange={props.onOpenChange}
            onFinish={props.onSubmit}
            initialValues={props.values}
        >
            <ProFormText
                width="md"
                name="id"
                label="Id"
                hidden={true}
                disabled={true}
            />
            <ProFormText
                width="md"
                name="name"
                label="连接名"
            />
            <ProFormText
                name="host"
                width="md"
                label="数据库IP"
            />
             <ProFormText
                width="md"
                name="user"
                label="数据库账户"
            />
            <ProFormText
                name="password"
                width="md"
                label="数据库密码"
            />
            <ProFormDigit
                width="md"
                name="port"
                tooltip="常规默认都是3306端口"
                label="数据库端口"
                initialValue={3306}
            />
            <ProFormText
                name="dbName"
                width="md"
                label="数据库名"
            />
            <ProFormText
                name="dumpPath"
                width="md"
                label="dump命令地址"
                tooltip="mysqldump在SSH服务器上的路 [通过 which mysqldump 查询] (docker的话格式为docker exec mysql /usr/bin/mysqldump)"
            />
            <ProFormText
                name="remoteBackupPath"
                width="md"
                tooltip="备份文件保存路径"
                label="备份存储地址"
            />
            <ProFormSelect
                width="md"
                name="dbType"
                label="数据库类型"
                valueEnum={props.dbTypeEnum}
                rules={[{ required: true, message: '请输入数据库类型！' }]}
            />
            <ProFormSelect
                width="md"
                name="sshId"
                label="SSH"
                tooltip="根据这个进行备份的"
                valueEnum={props.sshData}
                rules={[{ required: true, message: '请输入SSH！' }]}
            />
        </ModalForm>
    );
};
